<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Pragma" content="no-cache">
    <meta http-equiv="Cache-Control" content="no-cache">
    <meta http-equiv="Expires" content="0">
    <link rel="stylesheet" href="../../css/style.css">
    <title>商家管理中心登录</title>
    <style>
        html,body{width: 100%;height: 100%;}
        .box{
           width: 100%;
           height:100%;
            background: url(../../image/login_bg.png) no-repeat;
            background-size: cover;
            display: flex;
            align-items: center;
        }
        #container {
            width: 400px;
            height: 360px;
            margin: 0 auto;
            background-color: #ffffff;
            border-radius: 10px;
            box-shadow: 0px 0px 4px  2px #9e9492 ;
        }
        .main {
            width: 320px;
            margin: 0 auto;
        }
        .header p,label{color:#999;}
        h2 {color: #e44623;
        font-weight: bold;
        }
        input{  width: 320px;
            height: 30px;
            background-color: #e7e6b6df;
            padding-left: 30px;
        }
        .form-group{
            position: relative;
        }
        .glyphicon-user,.glyphicon-lock{position: absolute !important;left:6px;z-index: 5;top:34px;width: 16px;height: 16px;color: #ddd;padding-right:22px;border-right: 1px dotted #ddd;}
        .glyphicon-qrcode{z-index: 5;left:-121px;top:6px;width: 16px;height: 16px;color: #ddd;padding-right:22px;border-right: 1px dotted #ddd;}
        .btn-submit{background-color: #e44623;color: #ffffff;float: right;height: 30px;border-radius: 5px;padding: 5px 18px;}
        #imageCode {
            width: 130px;
           float: left;
        }
        #getimgcode {
            /* width: 130px; */
            height: 33px;
            display: none;
            position: absolute;
            border: 1px solid #ddd;
            margin-top: 15px;
        }
        #getimgcode img {
            width: 100px;
            height: 26px;
        }
        span#rpeatcode {
            height: 26px !important;
        }
        .glyphicon-repeat::after, .glyphicon-repeat::before{
            height: 26px;
            top: 4px;
            border: none;
        }
        #rpeatcode{
            height: 26px;
            line-height: 6px;
            background-color: rgba(255, 255, 255, 1);
            border: none;
        }
        :focus {outline:none;}
        ::-moz-focus-inner {border-color: transparent;}
    </style>
</head>

<body>
    <div class="box">
    <div id="container">
        <div class="main">
            <div class="header">
                <h2>商家管理中心</h2>
                <p>请输入您注册商铺时申请的商家名称<br>登录密码为商城用户通用密码</p>
            </div>
            <div class="content">
                <div class="form">
                    <div class="form-group">
                        <label for="">用户名</label><br>
                       <i class="glyphicon glyphicon-user"></i>
                        <input type="text"  id="loginName" >
                    </div>
                    <div class="form-group">
                        <label for="">密码</label><br>
                        <i class="glyphicon glyphicon-lock"></i>
                        <input type="password"  id="loginPwd">
                    </div>
                    <div class="from-group">
                        <label for="">验证码</label><br>
                        <i class="glyphicon  glyphicon-qrcode"></i>
                        <input type="text" id="imageCode">
               
                      <div id="getimgcode"><img src="http://test.wuyoutianxia.com/wy3sj/nologin/imageCode" alt=""><button id="rpeatcode"><i class="glyphicon glyphicon-repeat"></i></button></div>
                        <button class="btn btn-submit" id="logBtn">商家登录</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
    <script src="../../js/jquery.min.js" charset="utf-8"></script>
    <script src="../../js/bootstrap.min.js" charset="utf-8"></script>
    <script src="../../plugin/layer/layer.js" charset="utf-8"></script>
    <script src="../../plugin/bootstrap-datetimepicker/js/bootstrap-datetimepicker.js" charset="utf-8"></script>
    <script src="../../plugin/bootstrap-datetimepicker/js/bootstrap-datetimepicker.zh-CN.js" charset="utf-8"></script>
    <script src="../../plugin/wangEditor/release/wangEditor.min.js" charset="utf-8"></script>
    <script src="../../js/common.js" charset="utf-8"></script>
    <script src="../../js/bootstrap-paginator.js" charset="utf-8"></script>
    <script src="../../js/ajax.js" charset="utf-8"></script>

    <script>
        //点击
        $('#imageCode').click(function() {
            $('#getimgcode').show();
        })
        //Tab
        $('#loginPwd').keydown(function(event){
            if (event.keyCode == 9) {
                $('#getimgcode').show();
            }
        })
        //刷新验证码
        var index = 1;
        $('#rpeatcode').click(function() {
            var pageUrls = cncbk_common_tools.serverURL + '/nologin/imageCode?index=' + index;
            $('#getimgcode img').attr('src', pageUrls);
            index++;
        })
        //enter
        $(document).keydown(function(event){
            if (event.keyCode ==13) {
                $('#getimgcode').hide();
               $('#logBtn').click();
            }
        })
        //点击
        $('#logBtn').click(function(){
            $('#getimgcode').hide();
            var pageUrls = cncbk_common_tools.serverURL + 'login';
            // var pageUrls = cncbk_common_tools.serverURL + '/nologin/checkImageCode';
            var loginName = $('#loginName').val();
            var loginPwd = $('#loginPwd').val();
            var imageCode = $('#imageCode').val();
            console.log(loginPwd)
            data = {
                'loginName': loginName,
                'pwd': loginPwd,
                'imageCode': imageCode
            }
            $.ajax({
                url: pageUrls,
                type: "post",
                dataType: 'json',
                data: data,
                xhrFields: {
                    withCredentials: true
                },
                success: function(res) {
                	layer.msg(res.msg)
                    if (res.code == 200) {
                        // var navData = JSON.stringify(loginName);
                        $.cookie('loggedIn',loginName, {expires:1});
                        window.location.href = 'http://47.92.118.122/html/wytx/com_insale.html';
//                         window.location.href = 'com_insale.html';
                    }
                },
                error:function (err) {
                    console.log(err);
                }
            });
        })
    </script>


</body>

</html>
